<template>
	<MyDialog v-model="show" width="600" title="学生管理" :slot-show="false">
		<el-form :inline="true">
			<el-form-item>
				<el-input v-model="studentName" placeholder="输入学生姓名" clearable></el-input>
			</el-form-item>
			<el-form-item>
				<el-button type="primary" @click="addStudentName">添加学生</el-button>
				<el-button type="primary" @click="addStudentGroup">添加学生分组方案</el-button>
			</el-form-item>
		</el-form>

		<el-table :data="studentList">
			<el-table-column prop="orderBySort" label="学号"></el-table-column>
			<el-table-column prop="studnetName" label="学生姓名" width="200"></el-table-column>
			<el-table-column label="类型">
				<template #default="scope">
					<el-tag v-if="scope.row.manage == '1'">管理员</el-tag>
				</template>
			</el-table-column>
			<el-table-column label="操作" width="160">
				<template #default="scope">
					<el-dropdown placement="top-start">
						<el-button plain size="small">其它操作</el-button>
						<template #dropdown>
							<el-dropdown-menu>
								<el-dropdown-item v-for="item in settings.commonActions"
									@click="clickSommonSelect(item,scope.row)">{{item.name}}</el-dropdown-item>
							</el-dropdown-menu>
						</template>
					</el-dropdown>
				</template>
			</el-table-column>
		</el-table>

		<MyModal title="修改信息" v-if="updateModalShow" @confirm="confirmSubmitUpdate" @closeModal="closeModal" ref="myModal">
			<el-input type="number" v-model="studentNumber" placeholder="请输入学生学号(选填)" />
		</MyModal>

		<MyDialog v-model="popupShow" @cancel="popupShow = false" @confirm="updateClass">
			<view style="width:50%;margin: 40px auto;display: flex;justify-content: center;">
				<el-select v-model="classIndex1" filterable placeholder="点击选择班级" style="width: 240px">
					<el-option v-for="item in classArray" :key="item.id" :label="item.classname" :value="item.id" />
				</el-select>
			</view>
		</MyDialog>

		<SingInDetail v-if="singInDetailShow" @close="singInDetailShow = false" ref="singInDetail"></SingInDetail>
		<AddStudent v-if="addStudentShow" @close="addStudentShow = false" ref="addStudent"></AddStudent>
		<StudentGroup v-if="studentGroupShow" @close="studentGroupShow = false" ref="studentGroup"></StudentGroup>
	</MyDialog>

</template>

<script>
	var that;
	import MyModal from '@/component/MyModal/MyModal.vue'
	import MyDialog from '@/components/MyDialog.vue'
	import myMixin from '@/utils/myMixin.js'
	import SingInDetail from './SingInDetail.vue'
	import AddStudent from './AddStudent.vue'
	import StudentGroup from './StudentGroup.vue'
	import {
		useMouse
	} from '@/utils/index.js'
	import {
		nextTick
	} from 'vue';

	export default {
		mixins: [myMixin], //混入
		props: {
			schoolId: String, //班级id
			modelValue: Boolean
		},
		components: {
			MyDialog,
			MyModal,
			SingInDetail,
			AddStudent,
			StudentGroup
		},
		data() {
			return {
				studentGroupShow: false,
				addStudentShow: false,
				singInDetailShow: false,
				show: true,
				studentName: '',
				classIndex1: '',
				classArray: [], //班级列表
				idarr: [],
				studentList: [],
				studentList1: [],
				// schoolId: '', //班级id
				updateModalShow: false,
				popupShow: false,
				studentNumber: '', //学生学号
				settings: {
					orderBySort: '',
					studentName: '',
					commonActionSheetShow: false,
					id: '', //当前学生id
					unionid: '',
					commonActions: [{
							name: '删除学生',
						},
						{
							name: '修改学生信息',
						},
						{
							name: '设置为管理员',
						},
						{
							name: '取消管理员',
						},
						{
							name: '转班',
						},
						{
							name: '查看签到记录',
						},
					],
				}
			}
		},
		setup() {
			return useMouse();
		},
		mounted() {
			that = this;
			that.getList();
			// that.getClassNameList();

		},
		watch: {
			studentName(news, old) {
				console.log(news, old);
				that.studentList = that.studentList1.filter(item => item.studnetName.indexOf(news) != -1);
			},
			show(news) {
				this.$emit("close");
			}
		},
		methods: {
			addStudentGroup() {
				that.studentGroupShow = true;
				nextTick(() => {
					that.$refs["studentGroup"].classNameId = that.schoolId
				})
			},
			addStudentName() {
				that.addStudentShow = true;
				nextTick(() => {
					that.$refs["addStudent"].uploadData.classname = that.schoolId
				})
			},
			openStudentGroup() {
				let url = "/pagesAttendClass/studentGroup/studentGroup?classNameId=" + that.schoolId;
				// uni.navigateTo({
				// 	url: url
				// });
			},
			closeModal() {
				that.updateModalShow = false;
				that.studentNumber = '';
			},
			//转班
			async updateClass() {
				await that.$asyncHttpConfig({
					url: that.$store.state.url + '/student/updateClass',
					data: {
						id: that.settings.id,
						classNameId: that.classIndex1
					},
				})
				that.popupShow = false;
				that.getList();
			},
			//修改姓名
			async updateStudentInfo(content) {
				await that.$asyncHttpConfig({
					url: that.$store.state.url + '/student/updateStudentNameById',
					data: {
						id: that.settings.id,
						manage: content
					},
				})

				that.updateModalShow = false;
				that.getList();

			},
			//修改姓名
			async confirmSubmitUpdate(content) {
				await that.$asyncHttpConfig({
					url: that.$store.state.url + '/student/updateStudentNameById',
					data: {
						id: that.settings.id,
						studnetName: content,
						orderBySort: this.studentNumber ?? ''
					},
				})

				that.updateModalShow = false;
				that.studentNumber = '';
				that.getList();

			},
			async deleteById() {
				await that.$asyncHttpConfig({
					url: that.$store.state.url + '/student/deleteById',
					data: {
						id: that.settings.id,
						status: '1'
					},
				})

				that.getList();
			},
			async getList() {
				const data = await that.$asyncHttpConfig({
					url: that.$store.state.url + '/student/queryById1',
					data: {
						classnameid: that.schoolId,
						openid: that.$store.state.$userInfo.id,
					},
				})

				if (data.studentList.length == 0) {
					return that.hintMessage("暂无数据");
				} else {

					that.studentName = ''
					that.studentList = data.studentList;
					that.studentList1 = data.studentList;
				}

			},
			//点击记录弹出窗
			clickCommon(item) {
				// that.settings.commonActionSheetShow = true;
				that.settings.id = item.id;
				that.settings.studentName = item.studnetName;
				// that.settings.orderBySort = item.orderBySort;
			},
			//签到点击获取所点击选项name
			clickSommonSelect(index, row) {
				console.log(index.name);
				that.clickCommon(row);

				var name = index.name;
				if (name == '删除学生') {
					that.deleteById();
				} else if (name == '修改学生信息') {
					that.updateModalShow = true;
					nextTick(() => {
						console.log(that.settings.studentName, that.$refs["myModal"].content);
						that.$refs["myModal"].content = that.settings.studentName;
					})

					// that.studentNumber = that.settings.orderBySort;
				} else if (name == '设置为管理员') {
					that.updateStudentInfo("1");
				} else if (name == '取消管理员') {
					that.updateStudentInfo("0");
				} else if (name == '转班') {
					that.getClassNameList();
				} else if (name == '查看签到记录') {
					that.singInDetailShow = true;
					nextTick(() => {
						this.$refs["singInDetail"].studentId = that.settings.id;
					})
					// uni.navigateTo({
					// 	url: '/pages/todayRecord/todayRecord?studentId=' + that.settings.id
					// })
				}

			},
			//获取班级列表
			async getClassNameList() {
				if (that.classArray.length > 0) {
					that.popupShow = true;
					return;
				}
				let url = "/classname/queryAll1";
				var dataForm = {
					code: that.$store.state.$userInfo.id,
					organizationId: that.$store.state.organizationId,
					organizationType: that.$store.state.organizationType
				}

				//获取班级信息
				const data = await that.$asyncHttpConfig({
					url: url,
					data: dataForm
				})
				//这里只需要传入不同的接口地址就可以
				that.classArray = data.classNameList; //班级列表
				// that.idarr = data.idarr;s
				that.popupShow = true;
			},
		},

	}
</script>

<style>
</style>